<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet/less" type="text/css" href="less/productdetail.less" />
		<script src="js/less.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="css/touwei.css" />
		<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
	</head>
	<style type="text/css">
		#wu_dibu {
			height: 390px;
			width: 1200px;
			margin: 0px auto;
		}
		
		#wu_dibu .wu_dibudiv1 {
			/*border: 1px solid;*/
			background-color: #F8F8F8;
			height: 390px;
			width: 390px;
			float: left;
			margin-left: 10px;
		}
		
		.wu_dibudiv1 table {
			margin: 50px;
		}
		
		.wu_dibudiv1 table td {
			line-height: 50px;
		}
		/*#header{
			position: relative;top: 0px;
			z-index: 10;
		}*/
		
		#yonghuInfo {
			position: relative;
		}
		
		#kanche {
			display: none;
			position: absolute;
			height: 100px;
			border-radius: 5px;
			top: 50px;
			left: 10px;
			line-height: 15px;
			width: 70%;
			background-color: #FF9A37;
			padding: 10px;
		}
		
		#dianhua {
			position: absolute;
			display: none;
			height: 50px;
			border-radius: 5px;
			top: 50px;
			left: 10px;
			line-height: 15px;
			width: 70%;
			background-color: #FF9A37;
			text-align: center;
			color: white;
			font-size: 20px;
			line-height: 50px;
		}
		
		#kanche>div {
			height: 40px;
			margin: 0px;
			text-align: center;
		}
		
		#kanche>div>span {
			margin-left: 20px;
			color: white;
			font-size: 20px;
			line-height: 40px;
			margin: 0px;
		}
	</style>

	<body>
		<!--头部-->
		<div id="wu_quan">
			<div id="header">
				<!-- logo -->
				<a href="#" id="logo"><img src="img/logo.png"></a>
				<div id="links">
					<a href="#" id="username">未登录</a>
					<a href="#" id="loginout">登出</a>
				</div>
				<div id="navmenu">
					<nav id="menu">
						<ul>
							<li>
								<a href="index.html">首页</a>
							</li>
							<li class="active">
								<a href="productlist.html">买车</a>
							</li>
							<li>
								<a id="selcar" href="">卖车</a>
							</li>
							<li>
								<a href="xinche.html">新车</a>
							</li>
							<li>
								<a href="baodian.html">宝典</a>
							</li>
							<li>
								<a href="fwbz.html">服务保障</a>
							</li>
							<li>
								<a href="my_reg.html">注册</a>
							</li>
							<li>
								<a href="my_register.html">登录</a>
							</li>
						</ul>
					</nav>
					<div id="search">
						<form role="search" method="get">
							<input type="text" placeholder="search..." name="s" value="" autocomplete="off" />
						</form>
					</div>
				</div>
			</div>
			<br><br><br><br><br><br><br><br><br>
			<br><br>
			<div style="text-align:center;clear:both">
			</div>
		</div>
		<!--主体-->
		<div class="detailhead">
			<h2 class="wu_a1"><img  src="http://imgs.xin.com/xin/images/brand-100/b_26.png"> MINI MINI 2011款 1.6自动 COOPER Fun</h2>
			<p class="detailinfo">里程：<span class="wu_licheng">5.1万公里</span>上牌时间：<span class="wu_time">2013-03</span><span>过户次数：1次</span>看车地点：<span class="didian">北京</span></p>
			<div class="fixprice">
				<span class="price wu_price">
						￥15.58万
					</span>
				<span class="telephone">
						4000090119-917315
					</span>
			</div>
		</div>
		<div id="detailcontent" class="container">
			<ol class="breadcrumb row">
				<li>
					<a href="index.html">首页</a>
				</li>
				<li>
					<a href="#">二手车</a>
				</li>
				<li>
					<a class="wu_a" href="#">MINI二手车</a>
				</li>
				<li class="active wu_a1">MINI MINI 2011款 1.6自动 COOPER Fun</li>
			</ol>
			<div id="detailinfo" class="row">
				<h3 class="wu_a1"><img  src="http://imgs.xin.com/xin/images/brand-100/b_26.png"> MINI MINI 2011款 1.6自动 COOPER Fun</h3>
				<div class="detailimgs col-md-6">
					<!-- Modal -->
					<div class="modal fade bs-example-modal-lg" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
						<div class="modal-dialog modal-lg" role="document">
							<div class="modal-content">
								<div class="modal-body row">
									<div class="col-md-8">
										<div>
											<!-- Nav tabs -->
											<ul id="nav" class="nav nav-tabs" role="tablist">
												<li role="presentation" class="active">
													<a href="#home" aria-controls="home" role="tab" data-toggle="tab">外感</a>
												</li>
												<li role="presentation">
													<a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">内饰</a>
												</li>
												<li role="presentation">
													<a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">结构及发动机</a>
												</li>
												<li role="presentation">
													<a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">更多细节</a>
												</li>
											</ul>
											<!-- Tab panes -->
											<div class="tab-content tabimgs">
												<div role="tabpanel" class="tab-pane active" id="home">
													<img class="wu_img5" src="http://c3.xinstatic.com/f1/20170313/1438/58c63e73ec2f3437194_20.jpg" />
												</div>
												<div role="tabpanel" class="tab-pane" id="profile">
													<img class="wu_img2" src="http://c3.xinstatic.com/f1/20170313/1438/58c63e77e3a2c927335_20.jpg" />
												</div>
												<div role="tabpanel" class="tab-pane" id="messages">
													<img class="wu_img3" src="http://c3.xinstatic.com/f1/20170313/1438/58c63e75e82c2552734_20.jpg" />
												</div>
												<div role="tabpanel" class="tab-pane" id="settings">
													<img class="wu_img4" src="http://c3.xinstatic.com/f1/20170313/1438/58c63e775a988520938_20.jpg" />
												</div>
											</div>
										</div>
									</div>
									<div class="col-md-4 madelright">
										<h3 class="wu_a1">奔驰 A级 2013款 1.6T 自动 A180风尚型</h3>
										<p class="wu_price">19.50万</p>
										<div class="row">
											<div class="col-md-6">
												<p class="detaillittle wu_licheng">5.1万公里</p>
												<p class="detaillittle1">表显里程</p>
											</div>
											<div class="col-md-6">
												<p class="detaillittle wu_time">2015-02</p>
												<p class="detaillittle1">上牌时间</p>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<p class="detaillittle wu_chengxi">国5</p>
												<p class="detaillittle1">排放标准</p>
											</div>
											<div class="col-md-6">
												<p class="detaillittle wu_pailiang">1.6L/DCT双离合</p>
												<p class="detaillittle1">排量/变速箱</p>
											</div>
										</div>
										<button class="btn">电话咨询</button>
									</div>
								</div>
							</div>
						</div>
					</div>
					<img data-toggle="modal" data-target="#myModal" class="wu_img1" src="" />
					<img id="loading" src="img/loading.gif"/>
				</div>
				<div class="col-md-5 col-md-offset-1">
					<div class="row inforight">
						<p class="col-md-12 wu_price">￥15.58万<b>（含过户费）</b></p>
						<div class="row">
							<div class="col-md-4">
								<p class="detaillittle wu_licheng">5.1万公里</p>
								<p class="detaillittle1">表显里程</p>
							</div>
							<div class="col-md-4">
								<p class="detaillittle wu_time">2015-02</p>
								<p class="detaillittle1">上牌时间</p>
							</div>
							<div class="col-md-4">
								<p class="detaillittle wu_time1">2017-03-13</p>
								<p class="detaillittle1">上架时间</p>
							</div>
						</div>
						<div class="row">
							<div class="col-md-4">
								<p class="detaillittle wu_chengxi">国5</p>
								<p class="detaillittle1">排放标准</p>
							</div>
							<div class="col-md-4">
								<p class="detaillittle wu_pailiang">1.6L/DCT双离合</p>
								<p class="detaillittle1">排量/变速箱</p>
							</div>
							<div class="col-md-4">
								<p class="detaillittle didian">北京</p>
								<p class="detaillittle1">看车地点</p>
							</div>
						</div>
						<div class="row" id="yonghuInfo">
							<input class="btn btn-default" type="button" name="" id="yuyuekanche" value="预约看车" />
							<input class="btn btn-default" type="button" name="" id="dianhuazixun" value="电话咨询" />
							<div id="kanche">
								<div><span>车主：</span><span id="chezhu"></span></div>
								<div><span>看车地点：</span><span class="didian"></span></div>
							</div>
							<div id="dianhua">
								
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<p class="h2"></p>
		<div id="wu_dibu">
			<div class="wu_dibudiv1">
				<table border="0" cellspacing="0" cellpadding="0">
					<tr>
						<th colspan="2">基本信息</th>
					</tr>
					<tr>
						<td width="150">过户次数</td>
						<td>1次</td>
					</tr>
					<tr>
						<td>销售城市</td>
						<td>北京</td>
					</tr>
					<tr>
						<td>使用性质</td>
						<td>非营运</td>
					</tr>
					<tr>
						<td>年检到期</td>
						<td>2017-05-01</td>
					</tr>
					<tr>
						<td>保险到期</td>
						<td>2017-05-14</td>
					</tr>
					<tr>
						<td>保养情况</td>
						<td>4S店定期</td>
					</tr>
				</table>
			</div>
			<div class="wu_dibudiv1">
				<table border="0" cellspacing="0" cellpadding="0">
					<tr>
						<th colspan="2">外观参数</th>
					</tr>
					<tr>
						<td width="150">车辆厂商</td>
						<td>沃尔沃（进口）</td>
					</tr>
					<tr>
						<td>车辆级别</td>
						<td>SUV</td>
					</tr>
					<tr>
						<td>颜色</td>
						<td>黑色</td>
					</tr>
					<tr>
						<td>车身结构</td>
						<td>5门 7座 SUV-SUV</td>
					</tr>
					<tr>
						<td>整备质量</td>
						<td>2193 kg</td>
					</tr>
					<tr>
						<td>轴距</td>
						<td>4S店定期</td>
					</tr>
				</table>
			</div>
			<div class="wu_dibudiv1">
				<table border="0" cellspacing="0" cellpadding="0">
					<tr>
						<th colspan="2">发动机参数</th>
					</tr>
					<tr>
						<td width="150">发动机</td>
						<td>B6324S</td>
					</tr>
					<tr>
						<td>变速器 </td>
						<td>AT自动</td>
					</tr>
					<tr>
						<td>排量</td>
						<td>3192 mL</td>
					</tr>
					<tr>
						<td>燃料类型</td>
						<td>汽油</td>
					</tr>
					<tr>
						<td>驱动方式</td>
						<td>全时四驱</td>
					</tr>
					<tr>
						<td>综合油耗</td>
						<td>12.1 L/100km</td>
					</tr>
				</table>
			</div>
		</div>
		<p class="h2"></p>
		<!--尾部-->
		<div id="wu_foot">
			<div id="wu_foot_foot">
				<ul>
					<li>
						<a href="#">关于我们</a>
					</li>
					<li>
						<a href="#">加入我们</a>
					</li>
					<li>
						<a href="#">帮助中心</a>
					</li>
					<li>
						<a href="#">用户反馈</a>
					</li>
					<li>
						<a href="#">商家申请</a>
					</li>
					<li>
						<a href="#">鹏鹏易购</a>
					</li>
					<li>
						<a href="#">网站地图</a>
					</li>
				</ul>
				<div class="m30">

				</div>
				<p>热门城市：北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场</p>
				<p>热门品牌：北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场</p>
				<p>热门车系：北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场</p>
				<p>友情链接：北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场|北京二手车 交易市场</p>
				<div class="m10" style="border-bottom: 1px solid #515151;">

				</div>
				<p>业务合作单位：优信拍（北京）二手车鉴定评估有限公司</p>
				<p>Copyright © 2015-2017 优估 All Rights Reserved 版权所有 优估(上海) 信息科技有限公司</p>
				<p>营业执照沪ICP备15036207号-2 沪公网安备 31011402001229号 沪通信管自贸【2016】5号 联系电话：021-10106088</p>
			</div>
		</div>
		<script src="js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/currentUser.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var errocode;
			$(function() {
				$.getJSON("json/errocode.json", function(data) {
					errocode = data;
				});
			});
			$(window).ready(function() {
				$(window).scroll(function() {
					if($(window).scrollTop() > 150) {
						$(".detailhead").show()
					} else {
						$(".detailhead").hide()
					}
				})
				$("#yuyuekanche").on("click", function() {
					$("#dianhua").hide();
					$("#kanche").toggle("slow");
				});
				$("#dianhuazixun").on("click", function() {
					$("#kanche").hide();
					$("#dianhua").toggle("slow");
				});
			});
			$("#nav>li").click(function() {
				$(this).attr("background-color", "#FF5A37");
			});
			//获取当前车的所属车主 
			function Owener() {
				console.log(getUrlItem(location.search, "carid"));
				var str = {};
				str.ownerCar = {
						"__type":"Pointer",
						"className":"Post",
						"objectId":getUrlItem(location.search, "carid")
				};
				var strnew = JSON.stringify(str);
				$.ajax({
					type: "get",
					url: "https://api.leancloud.cn/1.1/classes/_User",
					async: true,
					headers: {
						"X-LC-Id": "9keh2YX5j8hpDc0YR2REhv0q-gzGzoHsz",
						"X-LC-Key": "rrdO8OEJACH5qna3m3FzhpYf",
						"Content-Type": "application/json"
					},
					data: 'where='+strnew,
					success: function(data) {
						console.log(data);
						$("#chezhu").html(data.results[0].username);
						$("#dianhua").html(data.results[0].phone);
					},
					error: function(e) {
						var code = JSON.parse(e.responseText).code;
						console.log(code);
						for(var i in errocode) {
							if(errocode[i].code == code) {
								console.log(errocode[i].content)
							}
						}
					}
				});
			}
			//获取url内的username
			function getUrlItem(url, name) {
				start = url.indexOf(name + "=");
				if(start != -1) {
					start = start + name.length + 1
					c_end = url.indexOf("&", start)
					if(c_end == -1) c_end = url.length
					return unescape(url.substring(start, c_end))
				}
				return '';
			}
			$(function() {
				$.ajax({
					type: "get",
					url: "https://api.leancloud.cn/1.1/classes/car/" + getUrlItem(location.search, "carid"),
					async: true,
					headers: {
						"X-LC-Id": "9keh2YX5j8hpDc0YR2REhv0q-gzGzoHsz",
						"X-LC-Key": "rrdO8OEJACH5qna3m3FzhpYf",
						"Content-Type": "application/json"
					},
					beforeSend: function() {
							$("#loading").show();
						},
					success: function(data) {
						$("#loading").hide();
						$(".wu_a").html(data.pingpai + "二手车");
						$(".wu_a1").html(data.pingpai + data.chexing);
						$(".wu_price").html(data.price);
						$(".wu_licheng").html(data.distance);
						$(".wu_time").html(data.shangpaiTime);
						$(".wu_time1").html(data.shangjiaTime);
						$(".wu_chengxi").html(data.PaifangRule);
						$(".wu_pailiang").html(data.pailiang);
						$(".didian").html(data.kanchedizhi);
						$(".wu_img1")[0].src = data.imgs[0];
						$(".wu_img5")[0].src = data.imgs[0];
						$(".wu_img2")[0].src = data.imgs[1];
						$(".wu_img3")[0].src = data.imgs[2];
						$(".wu_img4")[0].src = data.imgs[3];
						Owener();
					},
					error: function(e) {
						var code = JSON.parse(e.responseText).code;
						console.log(code);
						for(var i in errocode) {
							if(errocode[i].code == code) {
								console.log(errocode[i].content)
							}
						}
					}
				});
			});
			//申请为卖主
		</script>
	</body>

</html>